<template>
    <!-- 各单位端 线索反馈 -->
    <view class="viewBox">
        <view class="sumbitList">
            <label><span>*</span>乡镇街道:</label>
            <input type="text" placeholder="请输入" v-model="town">
        </view>
        <view class="sumbitList">
            <label><span>*</span>村社区:</label>
            <input type="text" placeholder="请输入" v-model="village">
        </view>
        <view class="sumbitList">
            <label><span>*</span>反馈人:</label>
            <input type="text" placeholder="请输入" v-model="feedbackPerson">
        </view>
        <view class="sumbitList">
            <label><span>*</span>反馈至:</label>
            <multiSelect style="width: 75%;" :list="list" :selVal="selVal" @changee="bb"></multiSelect>
        </view>
        <view class="sumbitList">
            <label><span>*</span>反馈时间:</label>
            <input :disabled="true" type="text" placeholder="请输入" v-model="feedbackTime" @click="show">
        </view>
        <view class="sumbitList">
            <label><span>*</span>事发地点:</label>
            <input type="text" placeholder="请输入" v-model="place">
        </view>
        <view class="sumbitList">
            <label>情况描述:</label>
            <textarea type="textarea" placeholder="请输入(非必填)" v-model="description"></textarea>
        </view>
        <tui-datetime :type="2" ref="dateTime" @confirm="change"></tui-datetime>
        <tui-button class="btn" width="80%" height="80rpx" margin="auto" :size="28" @click="add">确定</tui-button>
    </view>
</template>

<script>
import {
    mapState,
    mapGetters,
    mapMutations
} from 'vuex'
import multiSelect from "./multiSelect"

export default {
    components: {
        multiSelect
    },
    data() {
        return {
            list: [
                { id: 1, adminName: '暂无数据', show: false },
            ],
            selVal: [],
            "town":'', // "乡镇街道",
            "feedbackTime": '', // "2023-08-24",
            "feedbackPerson": '',// "反馈人",
            "village": '', // "村社区",
            "place":'', // "事发地点",
            "description": '', // "情况描述",
            "createType":  1, // 创建者类型 （1网格员, 2各单位）
        };
    },
    computed: {
        ...mapGetters(['tabBar', "hasLogin"]),
        ...mapState(["isUserPhone", 'userInfo']),
    },
    onLoad() {
        // this.getSelect();
    },
    onUnload() {

    },
    onShow() {

    },
    methods: {
        bb(data) {
            this.selVal = data.a;
            this.list = data.b;
        },
        getSelect() {
            this.$apis.completionData().then(res => {
                if(res.data) this.list = res.data;
            })
        },
        /** 一周巡查提交 */
        add() {
            if(this.town=='') return this.$api.msg('请输入乡镇街道');
            if(this.village=='') return this.$api.msg('请输入村社区');
            if(this.feedbackPerson=='') return this.$api.msg('请输入反馈人');
            if(!this.selVal.length) return this.$api.msg('请输入反馈至');
            if(this.place=='') return this.$api.msg('请输入事发地点');
            if(this.feedbackTime=='') return this.$api.msg('请输入反馈时间');
            this.$api.showLoading();
            this.$apis.clueAdd({
                "town": this.town, // "乡镇街道",
                "feedbackTime": this.feedbackTime, // "2023-08-24",
                "feedbackPerson": this.feedbackPerson,// "反馈人",
                "village": this.village, // "村社区",
                "place": this.place, // "事发地点",
                "description": this.description, // "情况描述",
                adminId: this.selVal.map(i=>i.id),
                "createType": this.userInfo.roleCode=='wgy' && 1 || 2, // 创建者类型 （1网格员, 2各单位）
            }).then(res => {
                this.$api.hideLoading();
                this.$api.msg('新增成功');
                uni.navigateBack({
                    delta: 1
                })
            })
        },
        show: function (e) {
            this.$refs.dateTime && this.$refs.dateTime.show();
        },
        change: function (e) {
            //选择的结果
            console.log(e);
            this.feedbackTime = e.result;
        }
    }
}
</script>

<style lang="scss">
page {
    background: #fff;
}
textarea {
    border: 1px solid #666;
    border-radius: 10rpx;
    padding: 20rpx;
    height: 6rem;
}
.btn {
    margin: auto;
}

.sumbitList {
    display: flex;
    margin: 30rpx 0;
    align-items: center;

    label {
        width: 25%;
        font-size: 30rpx;

        span {
            color: red;
        }
    }

    > input {
        width: 75%;
        height: 65rpx;
        padding: 0 30rpx;
        border-radius: 10rpx;
        border: 1px solid #999;
    }
}

.viewBox {
    padding: 20rpx;
    position: relative;
    height: 100%;
}
</style>